<template>
  <view class="filter_condition">
    <!-- 这个我吧类名调转了 -->
    <text
      :class="active == index ? 'click_filter_item ' : 'filter_item'"
      v-for="(item, index) in tabList"
      :key="index"
      @click="toggleClass(index)"
      >{{ item }}</text
    >
  </view>
</template>

<script>
export default {
  props: {
    tabList: {
      default: [],
    },
		active:{
			default:0
		}
  },
  data() {
    return {
     // active:'',
    };
  },
	// watch:{
	// 	nowactive:{
	// 		handler(){
	// 			this.active=this.nowactive
	// 		},
	// 		immediate:true,
	// 	}
	// },
  methods: {
    toggleClass(index) {
      this.$emit("toggleClass", index);
			// 0为全部
			// 1为待收货
			// 2为待发货
    },
  },
};
</script>

<style lang="less">
.filter_condition {
  display: flex;
  justify-content: space-around;
  align-items: center;
  height: 88rpx;
  background-color: #fff;
}
.filter_item {
  color: #3d3d3d;
  font-size: 30rpx;
  padding: 23rpx 59rpx;
}
.click_filter_item {
  color:#7d00ff ;
  font-size: 30rpx;
  padding: 23rpx 59rpx;
  border-bottom: 3px solid ;
}
.goods_item {
  display: flex;
  justify-content: space-between;
  /* align-items: center; */
  width: 698rpx;
  height: 209rpx;
  padding: 20rpx 26rpx;
  /* background-color: #ff0; */
}
</style>

